
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>统计图表</title>
    <link rel="stylesheet" type="text/css" href="../../admin/easyui/easyui/1.3.4/themes/default/easyui.css" />
<link rel="stylesheet" type="text/css" href="../../admin/easyui/css/wu.css" />
<link rel="stylesheet" type="text/css" href="../../admin/easyui/css/icon.css" />
<script type="text/javascript" src="../../admin/easyui/js/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="../../admin/easyui/easyui/1.3.4/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../admin/easyui/easyui/1.3.4/locale/easyui-lang-zh_CN.js"></script>

</head>
<body class="easyui-layout">
	<div class="easyui-layout" data-options="fit:true">
		<!-- Begin of toolbar -->
		<div id="wu-toolbar"><h2>统计图表</h2>
			<div class="wu-toolbar-button">
				<a href="#" class="easyui-linkbutton" iconCls="icon-chart-curve-add" onclick="statsByMonth()"
				plain="true">按月统计</a>
			<a href="#" class="easyui-linkbutton" iconCls="icon-chart-curve-edit" onclick="statsByDay()"
				plain="true">按日统计</a>
			</div>
		</div>
		<!-- End of toolbar -->
	<div class="easyui-accordion" style="width:960px;height:600px;">
		<div title="营业统计分析" iconCls="icon-chart-curve" style="overflow:auto;padding:10px;">
			 <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
			<div id="charts-div" style="width: 800px;height:500px;">
				
				<img src="../../upload/1547287973818.png">
			</div>
		</div>
	</div>
	</div>
	<!-- Begin of easyui-dialog -->
	
	<img src="/admin/easyui/images/load-page.gif" width="50%">
    <h1><font color="#15428B">加载中....</font></h1>
	<script type="text/javascript" src="../../admin/echarts/js/echarts.common.min.js"></script>
	<!-- End of easyui-dialog -->
	<script type="text/javascript">
	$(document).ready(function(){
		statsByDay();
	});
	function statsByMonth(){
		getData('month');	
	}
	function statsByDay(){
		getData('day');	
	}
	function getData(type){
		$.ajax({
			url:'get_stats',
			type:'post',
			dataType:'json',
			data:{type:type},
			success:function(data){
				if(data.type == 'success'){
					var title = '营业统计分析';
					if(type == 'month'){
						title = title + '(按月统计)';
					}else{
						title = title + '(按日统计)';
					}
					var option = {
							title: {
								text: title
							},
							xAxis: {
								type: 'category',
								boundaryGap: false,
								data: data.content.keyList
							},
							tooltip : {
								trigger: 'axis',
								axisPointer: {
									type: 'cross',
									label: {
										backgroundColor: '#6a7985'
									}
								}
							},
							yAxis: {
								type: 'value'
							},
							series: [{
								data: data.content.valueList,
								type: 'line',
								areaStyle: {}
							}]
					};
					myChart.setOption(option);
				}else{
					alert(data.msg)
				}
			}
		});
	}
	// 基于准备好的dom，初始化echarts实例
	var myChart = echarts.init(document.getElementById('charts-div'));
	
	// 指定图表的配置项和数据
	
	// 使用刚指定的配置项和数据显示图表。
	
		
		
		
		
		
	</script>
</body>
</html>
